import React,{Component} from 'react'
import 'antd/dist/antd.css'; 
import { Card, Avatar } from 'antd';
import avatar from '../../static/images/avatar.jpg';
import myweixin from '../../static/images/myweixin.png'
import Category from '../../pages/category/category'
import {connect} from 'react-redux'
import { Calendar } from 'antd';
import moment from 'moment' 
import {getDataByTime} from '../../store/actionCreator'
import { withRouter } from 'react-router';
const { Meta } = Card;
function onPanelChange(value, mode) {
    console.log(value, mode);
  }
class Info extends Component{
    constructor(){
        super();
        this.state={
        }
    }
    componentDidMount(){
    
    }
    getTime(date){
        //时间转化的库
       let time = moment(date).format('YYYY-MM-DD');
       this.props.history.push('/myblog/article/time/'+time);
       this.props.getDataByTime(time);
    }
    render(){
        return(
            <div className='container'>
            <Card style={{ marginTop: 10 }}>
          <Meta
            avatar={
              <Avatar src={avatar} />
            }
            title="顽固"
            description="前端小白，希望可以和大家一起进步！"
          />
        </Card>
        <Card size="small" title="介绍"  style={{ marginTop:10 }}>
            <span>前端小白，南京晓庄学校计算机专业学生，学习js，会react和vue(最爱react)，略懂java和安卓开发，了解linux，会简单使用git和webpack等工具，会在博客中分享自己遇到的问题，好的博文以及好用的软件。</span>
            <p>这是我的<a href="https://gitee.com/wite6666">码云（https://gitee.com/wite6666）</a>，上面有一些我学习完成的项目，希望能给大家一点思路。</p>
        </Card>
        <Category></Category>
        <div style={{ border: '1px solid #d9d9d9', borderRadius: 4,marginTop:10 }}>
            <Calendar fullscreen={false} onPanelChange={onPanelChange}  onSelect={(date)=>{this.getTime(date)}}/>
        </div>
            <Card
            hoverable
            style={{marginTop:10 }}
            cover={<img alt="example" src={myweixin} />}
        >
            <Meta title="联系方式" description="如果有问题或者中意我(手动狗头)，请联系我(VX)" />
        </Card>
            </div>
        )
    }
}
const mapStateToProps = (state)=>{
    //console.log(state.get('category').get("CategoryList"));
    return{
       categoryList:state.get('category').get('CategoryList')
    }
}

const mapDispatchToProps = (dispatch)=>{
    return{
        getDataByTime(time){
            var action = getDataByTime(time);
            dispatch(action);
        }
    }
}
export default withRouter(connect(mapStateToProps,mapDispatchToProps)(Info));